<template>
	<el-dialog title="用户优惠券" v-model="visible" :width="800" destroy-on-close @closed="$emit('closed')">
		<el-container>
		<el-header>
			<div class="left-panel">
				<div class="right-panel-search">
					<el-select style="width: 100px;" v-model="search.type" clearable
						placeholder="类型" filterable>
						<el-option v-for="(item, key) in types" :key="key" :label="item" :value="key" />
					</el-select>
					<el-select style="width: 150px;" v-model="search.receive_type" clearable
						placeholder="领取方式" filterable>
						<el-option v-for="(item, key) in receive_types" :key="key" :label="item" :value="key" />
					</el-select>
					<el-select style="width: 100px;" v-model="search.use_type" clearable
						placeholder="适用类型" filterable>
						<el-option v-for="(item, key) in use_types" :key="key" :label="item" :value="key" />
					</el-select>
					<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
				</div>
			</div>
			<div class="right-panel">
			</div>
		</el-header>
		<el-main class="nopadding">
		<scTable ref="table" :apiObj="apiObj" :params="{member_id: search.member_id}" row-key="id" stripe>
			<el-table-column label="ID" prop="id" width="50"></el-table-column>
			<el-table-column label="优惠券名字" prop="coupon_name" width="150"></el-table-column>
			<el-table-column label="类型" prop="type" width="150">
				<template #default="scope">
					<p >{{types[scope.row.type]}}</p>
				</template>
			</el-table-column>
			<el-table-column label="领取方式" prop="receive_type" width="150">
				<template #default="scope">
					<p >{{receive_types[scope.row.receive_type]}}</p>
				</template>
			</el-table-column>
			<el-table-column label="适用类型" prop="use_type" width="150">
				<template #default="scope">
					<p >{{use_types[scope.row.use_type]}}</p>
				</template>
			</el-table-column>
			<el-table-column label="面值" prop="amount" width="150"></el-table-column>
			<el-table-column label="有效期" prop="expired_time" width="150"></el-table-column>
			<el-table-column label="最低可用金额" prop="min" width="150"></el-table-column>
			<el-table-column label="开始时间" prop="start_time" width="150"></el-table-column>
			<el-table-column label="截止时间" prop="end_time" width="150"></el-table-column>
			<el-table-column label="状态" prop="status" width="80">
				<template #default="scope">
					<p >{{statuss[scope.row.status]}}</p>
				</template>
			</el-table-column>
		</scTable>
		</el-main>
		</el-container>
	</el-dialog>
</template>

<script>
	export default {
		emits: ['success', 'closed'],
		data() {
			return {
				visible: false,
				isSaveing: false,
				data: [],
				search: {
					type: '',
					receive_type: '',
					use_type: '',
					status: '',
					member_id: ''
				},
				apiObj: this.$API.marketing.coupon.couponMemberList,
				types: {'1': '满减券', '2': '打折券'},
				receive_types: {'1': '手动', '2': '赠送', '3': '会员', '4': '小程序链接', '5': '系统发放'},
				use_types: {'1': '通用', '2': '指定'},
				statuss: {'1': '已使用', '0': '未使用', '2': '已过期', '-1': '删除'}
				//表单数据
			}
		},
		mounted() {
		},
		methods: {
			//显示
			open(mode='edit'){
				this.mode = mode;
				this.visible = true;
				return this
			},
			//搜索
			upsearch() {
				// console.log(112, this.search)
				let search = JSON.parse(JSON.stringify(this.search))
				this.$refs.table.upData({
					status: 1,
					...search
				})
			},
			//表单注入数据
			setData(id){
				this.search.member_id = id
				// this.form.dept = data.dept

				//可以和上面一样单个注入，也可以像下面一样直接合并进去
				//Object.assign(this.form, data)
			}
		}
	}
</script>

<style>
</style>
